<style type="text/css">
    .clearfix::after{
        content: "";
        display: block;
        height: 0;
        clear:both;
        visibility: hidden;
    }
    .header-title {
        font-size: 0.4rem;
        height: 1.085rem;
        font-family: 'Microsoft YaHei';
        font-weight: bold;
        background-color: red;
        color: white;
        letter-spacing: 0.05rem;
    }
    .group-detail {
        height: 2rem;
        width: 100%;
    }
    .detail-image {
        height: 1.5rem;
        width: 1.5rem;
        margin-left: 0.4rem;
        margin-right: 0.4rem;
    }
    .detail-image img {
        height: 1.5rem;
        width: 1.5rem;
        border-radius: 50%;
        
    }
    .msg-name {
        font-weight: bold;
        font-size: 0.5rem;
    }
    .msg-intro {
        font-size: 0.2rem;
        margin-top: 0.3rem;
    }
    .detail-msg {
        width: 4.3rem;
    }
    .detail-more {
        color: #bdbcbc;
        font-weight: bold;
        font-size: 0.4rem;
    }
    .group-member {
        margin-top: 0.2rem
    }
    .member-head {
        width: 100%;
    }
    .member-head span{
        float: left;
    }
    #nummem {
        float: right;
    }
    .member-list {
        margin-top: 0.2rem;
    }
    
    .item-img img {
        width: 1rem;
        height: 1rem;
        border-radius: 50%;
    }
    .item-name {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        width: 100%;
    }
    .setting-content {
        font-size: 0.35rem;
        border-width: 0.01rem
    }
    .setting-head {
        margin: 0.2rem 0.2rem;
    }
    #checkphoto11{
        height: 100%;
        width: 100%;
        background-color: black;
    }
    #checkphoto21{
        height: 100%;
        width: 100%;
        margin: auto;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: black;
        
    }
</style>

<div class="bui-page bui-box-vertical chatgroup-page">
    <header>
       <div class="bui-bar header-title" style="background-color: red;">
        <div class="bui-bar-left">
            <a class="bui-btn" onclick="bui.back();"><i class="icon-back"></i></a>
        </div>
        <div class="bui-bar-main" style="font-size: 0.4rem;">群聊设置</div>
        <div class="bui-bar-right">
            
        </div>
       </div>
    </header>
    <main>
        
        <div id="group-detail" class="bui-box bui-btn group-detail bui-box-align-middle">
            <div id="detail-image" class="bui-box bui-box-center detail-image">
                <img src="">
            </div>  
            <div class="bui-box detail-msg">
                <div class="msg-name" id="msg-name"></div>
                <div class="msg-intro" id="msg-intro"></div>
            </div>
            <div class="bui-box bui-box-center detail-more">
                <i class="icon-right">&#xe64c;</i>
            </div>
        </div>
        
        <div id="group-member" class="bui-btn group-member">
            <div class="member-head clearfix">
                <span>群聊成员</span>
                <span id="nummem">
                    <span>共1人</span>
                    <i class="icon-right">&#xe64c;</i>
                </span>
            </div>
            <div class="member-list bui-box">
                <div class="span2 bui-box-center bui-box-vertical member-item">
                    <div class="item-img">
                        <img src="images/other/35.jpg">
                    </div>
                    <div class="item-name">lll</div>
                </div>
                
            </div>
        </div>

        <div class="group-setting">
            <div class="setting-head clearfix">
                <div style="float: left;">群聊设置</div>
            </div>
            <div id="btn-gname" class="setting-content bui-btn clearfix">
                <span style="float:left; font-weight: bold;">群聊名称</span>
                <span style="float: right;"><i class="icon-right">&#xe64c;</i></span>
            </div>
            <div id="btn-mute" class="setting-content bui-btn clearfix">
                <span style="float:left; font-weight: bold;">禁言设置</span>
                <span style="float: right;"><i class="icon-right">&#xe64c;</i></span>
            </div>
        </div>
    </main>
    <footer>
        <!-- 底部内容 -->
    </footer>
</div>

<div id="dialogCheck1" class="bui-dialog" style="display: none;">
    <div id="checkphoto11">
        <div id="checkphoto21"></div>
    </div>
    <div class="bui-dialog-close"><i class="icon-close"></i></div>
</div>